モバイルデザインパターン ―ユーザーインタフェースのためのパターン集
https://gyazo.com/436c6fe08c68b1e8c6ad72a8b8bed81d
※Scrapboxのリンクに合うように、目次タイトル編集しています
1.1 主要なナビゲーションのパターン(永続的)
1.1.7 Skeuomorphic(実物に似せる)
1.2 主要なナビゲーションのパターン(一時的)
1.3 補助的なナビゲーションのパターン
1.3.1 Page Swiping(ページのスワイプ)
1.3.2 Scrolling T ab(スクロールタブ)
✅2.3 Registration with Personalization(パーソナライズされた登録 )
✅2.4 Multi-Step(複数のステップ)
2.5.1 ヒント1:サインイン、登録、ゲストとしての利用
2.5.2 ヒント2:フローをシンプルに
2.5.3 ヒント3:ショートカットで時間を節約
2.5.4 ヒント4:エクスプレスチェックアウト
2.5.5 ヒント5:Webについては忘れる
2.6 Calculator Form(計算 UI) 第3章 テーブル
3.2 Headerless T able(ヘッダーのないテーブル)
3.3 Fixed Column(固定された列)
3.4 Overview plus Data(概要とデータ)
3.5 Grouped Row(グループ化された行)
3.6 Table with Visual Indicator(視覚的インジケーターを含むテーブル)
3.7 Editable T able(編集可能なテーブル)
第4章 検索、並べ替え、フィルタリング
4.1 検索のパターン
4.1.1 Implicit Search(暗黙の検索)
4.1.2 Explicit Search(意図的な検索)
4.1.3 Search with Auto-Complete(オートコンプリート付き検索)
4.1.4 Dynamic Search(動的な検索)
4.1.5 Scoped Search(対象を限定した検索)
4.1.6 Saved, Recent, and Popular Search(保存された検索、最近行った検索、よく行われる検索)
4.1.7 Search Form(検索フォーム)
4.1.8 Search Result/View Result(検索結果 /表示結果)
4.2 並べ替えのパターン
4.2.1 Onscreen Sort(画面上での並べ替え)
4.2.2 Sort Overlay(並べ替えのオーバーレイ表示)
4.2.3 Sort Form(並べ替えフォーム)
4.3 フィルタリングのパターン
4.3.1 Onscreen Filter(画面上でのフィルタリング)
4.3.2 Filter Overlay(フィルタリング設定のオーバーレイ表示)
4.3.3 Filter Form(フィルタリングフォーム)
4.3.4 Filter Drawer(フィルタリングドロワー)
4.3.5 Gesture-Based Filtering(ジェスチャーに基づくフィルタリング)
第5章 ツール
5.1 T oolbar(ツールバー)
5.1.1 iOS
5.1.2 Android
5.1.3 Windows Phone
5.1.4 コンテキストごとのツールバー(全 OSで利用可能)
5.2 T oolbox(ツールボックス)
5.3 Call to Action Button(アクションボタン)
5.4 Inline Action(インラインアクション)
5.5 Multi-State Button(複数の状態を表すボタン)
5.6 Contextual T ool(コンテキストごとのツール)
5.7 Bulk Action(アクションの一括実行)
5.8 Lock Screen Control(ロック画面でのコントロール)
第6章 チャート
6.0
6.0.1 ヒント1:基本を学ぶ
6.0.2 ヒント2:シンプルに
6.0.3 ヒント3:「ここで算数クイズです」
6.0.4 ヒント4:ツールを知る
6.1 Chart with Filter(フィルタリング機能付きのグラフ)
6.2 Interactive Timeline(インタラクティブなタイムライン)
6.3 Data Point Detail(特定の点の詳細)
6.4 Drill Down(階層型の操作)
6.5 Overview plus Data(概要とデータ)
6.6 Interactive Preview(インタラクティブなプレビュー)
6.7 Dashboard(ダッシュボード)
6.8 Zoom(ズーム)
6.9 Sparkline(スパークライン)
6.10 Integrated Legend(埋め込まれた凡例)
6.11 Threshold(境界値)
6.12 Pivot T able(ピボットテーブル)
6.13 まとめ
第7章 チュートリアルと誘導
7.1 チュートリアルの原則
7.1.1 ルール1:文字を少なく
7.1.2 ルール2:最初に全部見せない
7.1.3 ルール3:やりがいを与える
7.1.4 ルール4:利用を通じて学習を強化する
7.1.5 ルール5:ユーザーの声を聞く
7.2 誘導のパターン
7.2.1 Tip(ヒント)
7.2.2 Persistent Invitation(永続的な誘導)
7.2.3 Discoverable Invitations(発見型の誘導)
7.3 番外編:誘導(歓迎の心)
7.3.1 歓迎のエクスペリエンスの段階的改善
7.3.2 まとめ
第8章 ソーシャル
8.1 Social Registration(ソーシャルな登録)
8.1.1 MapMyFitnessと We Heart Itの比較
8.2 Connecting(つながり)
8.3 Following(フォロー)
8.4 Profile(プロフィール)
8.5 Group(グループ)
8.6 Gamification(ゲーミフィケーション)
第9章 フィードバックとアフォーダンス
9.1 フィードバックのパターン
9.1.1 Error Message(エラーメッセージ)
9.1.2 Confirmation(確認表示)
9.1.3 System Status(システムの状態)
9.2 アフォーダンスのパターン
9.2.1 T ap(タップ)
9.2.2 Swipe/Flick(スワイプ /フリック)
9.2.3 Drag(ドラッグ)
第10章 ヘルプ
10.1 How-T o(ハウツー)
10.2 User Guide/Help System(ユーザーガイド /ヘルプのシステム)
10.3 F AQ(よくある質問)
10.4 Feature T our(機能紹介のツアー)
10.5 T utorial(チュートリアル)
10.6 Contextual Help(コンテキストごとのヘルプ)
10.7 Capture Feedback(フィードバックの収集)
第11章 アンチパターン
11.1 Novel Notion(新しいだけのアイデア)
11.2 Needless Complexity(不必要な複雑さ)
11.3 Metaphor Mismatch(メタファーの不一致)
11.3.1 コントロールの不一致
11.3.2 アイコンの不一致
11.3.3 ジェスチャーの不一致
11.3.4 メンタルモデルの不一致
11.4 Idiot Box(愚かなダイアログ)
11.5 Chart Junk(無駄なグラフ)
11.6 Oceans of Button(無数のボタン)
11.7 Square Peg, Round Hole(丸い穴に四角いくぎ)
11.8 番外編:モバイルでのサインアップとサインインに見られるLet Them Peeアンチパターン